// 使用方式：模板接受传参：dataList type
// 图片加载成功或失败的函数名：imgLoad($event, item, index)； imgError($event, item, index)
//  内容高度有图片高度+固定元素高度组成，固定元素高度的id必须是 'data-' + index
export const templateMixin = {
	data() {
		return {
		}
	},
	props: {
		dataList: {
			type: Array,
			default: () => {
				return [];
			}
		},
		elW:{
			type:Number,
			default:0
		},
		type: {
			type: Boolean,
			default: false
		} // 是否需要执行图片加载回调(是否只是用来获取图片宽高)
	},
	methods: {
		imgLoad(e, item, index) {
			this.getH(item, index, { width: e.detail.width, height: e.detail.height });
		},
		imgError(e,item, index) {
			this.getH(item, index);
		},
		/**
		 *
		 * @param {*} obj 数据项
		 * @param {*} index
		 * @param {*} sourseObj 图片资源的宽高数据
		 */
		getH(obj, index, sourseObj) {
			let item = {
				...obj
			};
			// 有时候图片加载好了，但是还没有撑开大盒子，导致大盒子的高度不准 ,所有只获取盒子里面的稳定一点的元素的高度
			let id = '#data-' + index;
			this.$uGetRect(id).then(res => {
				let params = {
					imgH: 0
				};
				let { height, width } = res;
				if (sourseObj) {
					params.imgH = (width / sourseObj.width) * sourseObj.height;
				}else{
					// 无图片资源/图片资源加载太慢/加载出错
					params.imgH = 140
					params.errImg = this.vuex_config.errImg
					// params.errImg = 'http://klwl-file.oss-cn-shenzhen.aliyuncs.com/202104/jhstest/52320344224983.png'
				}
				item.templateInfo = {
					...params,
					itemH: height + params.imgH
				};
				this.$emit('updateItem', item, index);
			});
		},
		// 处理没有图片的项
		checkNoImg(noneLoadList) {
			if (noneLoadList.length > 0) {
				noneLoadList.forEach(i => {
					this.getH(this.dataList[i], i);
				});
			}
		},
	}

}
